<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>图书管理</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" href="./css/font.css">
    <link rel="stylesheet" href="./css/xadmin.css">
    <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <script type="text/javascript" src="./lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="./js/vue.js"></script>
    <script type="text/javascript" src="./js/sha.js"></script>
    <script type="text/javascript" src="./js/xadmin.js"></script>
    <script type="text/javascript" src="./js/qx.js"></script>
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
      <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
      <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
   
</head>
<style type="text/css">
    [v-cloak] {
        display: none;
    }
</style>
<style>
    .num:hover {
        display: inline-block;
        background: #009688 url() 0 0 no-repeat;
        color: #fff;
        padding: 10px;
        min-width: 15px;
        border: 1px solid #009688;
    }

    .page .w_num {
        display: inline-block;
        background: #009688 url() 0 0 no-repeat;
        color: #fff;
        padding: 10px;
        min-width: 15px;
        border: 1px solid #009688;
    }
</style>

<body class="layui-anim layui-anim-up">
    <div class="x-nav">
        <span class="layui-breadcrumb">
        <a href="">首页</a>
        
        <a>
          <cite>图书管理</cite></a>
      </span>
        <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
        <i class="layui-icon" style="line-height:30px">ဂ</i></a>
    </div>
    <div class="x-body">
        <div class="layui-row">


            <button class="layui-btn" lay-submit="" lay-filter="sreach" onclick="addnew()">新增</button>

        </div>
        <xblock>

            <span class="x-right" style="line-height:40px">共有数据：<span id="mysum"></span> 条 当前第<span id="currentnumber"></span>页</span>
        </xblock>
        <table class="layui-table" id="app" v-cloak>
            <thead>
                <tr>

                    <th>射频识别码</th>
                    <th>图书名字</th>
                    <th>出版社名字</th>
                    <th>价格</th>
                    <th>图书缩略图</th>
                     <th>出版日期</th>
                    <th>操作</th>


            </thead>
            <tbody>
                <tr v-for="(item,index) in list2">
                     <th>{{item.id1}}</th>
                     <th>{{item.bookname}}</th>
                    <th>{{item.chubanshe}}</th>
                    <th>{{item.price}}</th>
                    <th><img :src="item.img"></th>
                     <th>{{item.day}}</th>
                    <th><a style="color: blue" @click="update(item.id1)">修改</a>&nbsp;
                        <a style="color:blue" @click="delete1(item.id1)">删除</a>
                    </th>

                </tr>
                <!-- <tr>
            <td>
              <div class="layui-unselect layui-form-checkbox" lay-skin="primary" data-id='2'><i class="layui-icon">&#xe605;</i></div>
            </td>
            <td>1</td>
            <td>小明</td>
            <td>男</td>
            <td>13000000000</td>
            <td>admin@mail.com</td>
            <td>北京市 海淀区</td>
            <td>2017-01-01 11:11:42</td>
            <td class="td-status">
              <span class="layui-btn layui-btn-normal layui-btn-mini">已启用</span></td>
            <td class="td-manage">
              <a onclick="member_stop(this,'10001')" href="javascript:;"  title="启用">
                <i class="layui-icon">&#xe601;</i>
              </a>
              <a title="编辑"  onclick="x_admin_show('编辑','member-edit.html',600,400)" href="javascript:;">
                <i class="layui-icon">&#xe642;</i>
              </a>
              <a onclick="x_admin_show('修改密码','member-password.html',600,400)" title="修改密码" href="javascript:;">
                <i class="layui-icon">&#xe631;</i>
              </a>
              <a title="删除" onclick="member_del(this,'要删除的id')" href="javascript:;">
                <i class="layui-icon">&#xe640;</i>
              </a>
            </td>
          </tr> -->
            </tbody>
        </table>
        <div class="page">
            <div id="pagenumber">




            </div>

        </div>

    </div>
    <script src="./lib/layui/layui.js" charset="utf-8"></script>
    <script src="./js/x-layui.js" charset="utf-8"></script>
    <script>
        layui.use(['element', 'laypage', 'layer', 'form'], function() {
            $ = layui.jquery; //jquery
            lement = layui.element(); //面包导航
            laypage = layui.laypage; //分页
            layer = layui.layer; //弹出层
            form = layui.form(); //弹出层


        })
    </script>
    <script>
        layui.use('laydate', function() {
            var laydate = layui.laydate;

            //执行一个laydate实例
            laydate.render({
                elem: '#start' //指定元素
            });

            //执行一个laydate实例
            laydate.render({
                elem: '#end' //指定元素
            });
        });

        /*用户-停用*/
        function member_stop(obj, id) {
            layer.confirm('确认要停用吗？', function(index) {

                if ($(obj).attr('title') == '启用') {

                    //发异步把用户状态进行更改
                    $(obj).attr('title', '停用')
                    $(obj).find('i').html('&#xe62f;');

                    $(obj).parents("tr").find(".td-status").find('span').addClass('layui-btn-disabled').html('已停用');
                    layer.msg('已停用!', { icon: 5, time: 1000 });

                }
                else {
                    $(obj).attr('title', '启用')
                    $(obj).find('i').html('&#xe601;');

                    $(obj).parents("tr").find(".td-status").find('span').removeClass('layui-btn-disabled').html('已启用');
                    layer.msg('已启用!', { icon: 5, time: 1000 });
                }

            });
        }

        /*用户-删除*/
        function member_del(obj, id) {

        }



        function delAll(argument) {

            var data = tableCheck.getData();

            layer.confirm('确认要删除吗？' + data, function(index) {
                //捉到所有被选中的，发异步进行删除
                layer.msg('删除成功', { icon: 1 });
                $(".layui-form-checked").not('.header').parents('tr').remove();
            });
        }
    </script>
    <script>
        var _hmt = _hmt || [];
        (function() {
            var hm = document.createElement("script");
            hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190";
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(hm, s);
        })();
    </script>
    <script src="js/vue.js"></script>
    <script>
        //获取病人用户信息
        var pgsj = ''
        var pgsj1 = ''

        var iskongzhi = 0
        var pagesize = 7
        //当前页码
        var myindex = 0
        var vue = new Vue({
            el: "#app",
            data: {
                list: [],
                list2: []
            },
            methods: {
                delete1: function(index) {
                    
                        var that = this
                        layer.confirm('确认删除图书吗？', function(index1) {
                            now = Date.now();
                            var appid = 'A6006135811896'
                            var apptoken = '029BA0D4-D0F5-A3A9-D158-E0A88793E074'
                            appKey = hex_sha1(appid + "UZ" + apptoken + "UZ" + now) + "." + now
                            //alert(now)
                            var url

                            url = 'https://d.apicloud.com/mcm/api/books/' + index

                            $.ajax({
                                "url": url,
                                "method": "POST",
                                "cache": false,
                                "async": false,
                                "headers": {
                                    "X-APICloud-AppId": appid,
                                    "X-APICloud-AppKey": appKey
                                },
                                "data": {
                                    "_method": "DELETE",

                                },
                                "success": function(data, status) {

                                    layer.msg('删除完毕!', { icon: 5, time: 1000 });
                                    location.replace(location.href)

                                }
                            })

                        });

                    
                  

                },
                init: function() {
                    //获取数据

                    var count = this.list.length
                    document.getElementById("mysum").innerHTML = count
                    count = parseInt(count)

                    // document.getElementById("rsum").innerHTML = count
                    // alert(count)
                    if (count % pagesize == 0) {
                        pagecount = count / pagesize
                        document.getElementById("pagenumber").innerHTML = ""
                        var html = ""
                        html = ""
                        for (i = 0; i < pagecount; i++) {
                            var index = i + 1
                            var scount = (index - 1) * pagesize
                            if (index == 1) {
                                scount = 0
                            }
                            var id = "mypage" + index
                            html = html + ' <a class="num h_num" name="mypage" onclick="initdata(' + scount + ',' + index + ')"  id="' + id + '">' + index + '</a>'
                            // alert(html)
                        }
                        document.getElementById("pagenumber").innerHTML = html
                        // alert( document.getElementById("pagenumber").innerHTML)
                        initdata(0, 1);

                    }
                    else {
                        pagecount = parseInt((count / pagesize)) + 1
                        document.getElementById("pagenumber").innerHTML = ""
                        var html = ""
                        html = ""
                        for (i = 0; i < pagecount; i++) {
                            var index = i + 1
                            var scount = (index - 1) * pagesize
                            if (index == 1) {
                                scount = 0
                            }

                            var id = "mypage" + index
                            html = html + ' <a class="num h_num" name="mypage" onclick="initdata(' + scount + ',' + index + ')"  id="' + id + '">' + index + '</a>'
                        }
                        // alert(html)
                        document.getElementById("pagenumber").innerHTML = html
                        initdata(0, 1);

                    }
                },
                update: function(index) {
                    var res = check_perm1('修改职称', '1');
                    if (res) {
                        localStorage.zhichengid = index
                        question_add('科室管理', 'update_zhicheng.html', '700', '600')
                    }
                    else {
                        layer.alert("你没有该权限访问！", { icon: 6 });
                        return false
                    }
                },
                jy: function(id) {
                    layer.confirm('确认要禁用吗？', function(index) {
                        vue.list2[id].status = '1'
                        layer.msg('禁用成功', { icon: 1 });
                    });
                },
                qy: function(id) {
                    layer.confirm('确认启用吗？', function(index) {
                        vue.list2[id].status = '0'
                        layer.msg('启用成功', { icon: 1 });
                    });
                },
                detail(title, url, w, h) {
                    x_admin_show(title, url, w, h);
                },
                qiyong: function(id) {
                    var mylist = this.list2

                    layer.confirm('确认要删除吗？', function(index) {
                        //捉到所有被选中的，发异步进行删除
                        mylist.splice(id, 1);
                        vue.list2 = mylist
                        layer.msg('删除成功', { icon: 1 });
                    });

                }
            }
        })
        // vue.init()
        function initdata(index, id) {
            //获取分页数据

            document.getElementById("currentnumber").innerHTML = id
            $('.h_num').removeClass('w_num');
            $('.h_num').eq(id - 1).addClass('w_num');
            var list = vue.list
            // alert(JSON.stringify(list))
            vue.list2 = []


            for (i = index; i < pagesize + index; i++) {
                //获取数据

                var json = {}
                json.id = list[i].id
                    json.bookname=list[i].bookname
                    json.img=list[i].img
                    json.price=list[i].price
                    json.zuozhe=list[i].zuozhe
                    json.file1=list[i].file1
                    json.file2=list[i].file2
                    json.chubanshe=list[i].chubanshe
                    json.day=list[i].day
                    json.content=list[i].content
                json.id1 = list[i].id1



                vue.list2.push(json)
            }
            // bindload()
            // alert(vue.list2)
        }

        function question_add(title, url, w, h) {
            x_admin_show(title, url, w, h);
        }

        function opennewpage() {
            // alert("fsf")
            window.location = "member-list3.html"
        }

        function addnew() {
           
                question_add('图书管理', 'my_detail7.html', '700', '600')
           
        }
    </script>
</body>
<style>
    .num:hover {
        display: inline-block;
        background: #009688 url() 0 0 no-repeat;
        color: #fff;
        padding: 10px;
        min-width: 15px;
        border: 1px solid #009688;
    }
</style>

</html>
<script>
    var pagesize = 99
    var rcount = 0

    function countdata4() {
        now = Date.now();
        var appid = 'A6006135811896'
        var apptoken = '029BA0D4-D0F5-A3A9-D158-E0A88793E074'
        appKey = hex_sha1(appid + "UZ" + apptoken + "UZ" + now) + "." + now
        //alert(now)
        var url

        url = 'https://d.apicloud.com/mcm/api/books/count'

        $.ajax({
            "url": url,
            "method": "get",
            "cache": false,
            "async": false,
            "headers": {
                "X-APICloud-AppId": appid,
                "X-APICloud-AppKey": appKey
            },
            "success": function(data, status) {
                vue.list = []
                sum = data.count
                // alert(sum)
                var count = data.count

                count = parseInt(count)

                // document.getElementById("rsum").innerHTML = count
                // alert(count)
                if (count % pagesize == 0) {
                    pagecount = count / pagesize

                    var html = ""
                    html = ""
                    for (i = 0; i < pagecount; i++) {
                        var index = i + 1
                        var scount = (index - 1) * pagesize
                        if (index == 1) {
                            scount = 0
                        }

                        html = html + '<button><a onclick="initdata(' + scount + ')" style="color:#fff">' + index + '</a></button>'
                        // alert(html)
                        initdata1(scount, count);
                    }
                    // document.getElementById("pagenumber").innerHTML = html
                    // alert( document.getElementById("pagenumber").innerHTML)


                }
                else {
                    pagecount = parseInt((count / pagesize)) + 1

                    var html = ""
                    html = ""
                    for (i = 0; i < pagecount; i++) {
                        var index = i + 1
                        var scount = (index - 1) * pagesize
                        if (index == 1) {
                            scount = 0
                        }
                        initdata1(scount, count);
                        html = html + '<button><a onclick="initdata(' + scount + ')" style="color:#fff">' + index + '</a></button>'
                    }

                    // alert( document.getElementById("pagenumber").innerHTML )

                }


            }
        })
    }
    countdata4()

    function initdata1(index, count) {
        // alert(index)
        var url = 'https://d.apicloud.com/mcm/api/books?filter[order]=id DESC&filter[limit]=999&filter[skip]=' + index
        now = Date.now();
         var appid = 'A6006135811896'
        var apptoken = '029BA0D4-D0F5-A3A9-D158-E0A88793E074'
        appKey = hex_sha1(appid + "UZ" + apptoken + "UZ" + now) + "." + now
        $.ajax({
            "url": url,
            "method": "get",
            "cache": false,
            "async": false,
            "headers": {
                "X-APICloud-AppId": appid,
                "X-APICloud-AppKey": appKey
            },
            "success": function(data, status) {
                // alert(rcount)
                for (i = 0; i < data.length; i++) {
                    var json = {}
                    json.id = rcount + 1
                    json.bookname=data[i].bookname
                    json.img=data[i].img
                    json.price=data[i].price
                    json.zuozhe=data[i].zuozhe
                    json.file1=data[i].file1
                    json.file2=data[i].file2
                    json.chubanshe=data[i].chubanshe
                    json.day=data[i].day
                    json.content=data[i].content
                    json.id1 = data[i].id
                    vue.list.push(json)
                    rcount++
                }
                // alert(JSON.stringify(vue.list))

                if (rcount == count) {
                    // alert("dsfsd")
                    vue.init()

                }



            }
        })
    }
</script>
